import { App, Button, Form, message } from 'antd';
import '@ant-design/v5-patch-for-react-19';
import { PlusCircleIcon } from '@heroicons/react/24/outline';
import {
  ModalForm,
  ProForm,
  ProFormCascader,
  ProFormDigit,
  ProFormSelect,
  ProFormText,
  ProFormTextArea,
} from '@ant-design/pro-components';

import hangye2017 from './data/hangye2017.json';

const waitTime = (time = 100) => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(true);
    }, time);
  });
};

function SetUseApp() {

  const { message, notification, modal } = App.useApp();
  modal.success({ title: '提交成功' });
  notification.info({ message: 'Good' });
  modal.warning({ title: 'Warning' });

  return <div />
}


export default function CompanyInfo() {
// Cascader field Just show the latest item.

  const [form] = Form.useForm();

  const displayRender = (labels: string[]) => labels[labels.length - 1];

  return (
    <ModalForm
      /* title="新增企业信息" */
      trigger={
        <Button type="primary">
          <PlusCircleIcon className="text-white-500 size-5" />
          企业信息录入
        </Button>
      }
      form={form}
      layout="horizontal"
      autoFocusFirstInput
      scrollToFirstError
      modalProps={{
        destroyOnClose: true,
        onCancel: () => {
          console.log('cancel');
        },
        width: '65%',
        style: { top: 50, left:20 }
      }}
      submitTimeout={2000}
      onFinish={async (values) => {
        try {
          await form.validateFields();
          console.log('Success:', values);
        } catch (errorInfo) {
          console.log('Validate Failed:', errorInfo);
        }
        await waitTime(2000);

        console.log(values);
        message.success('提交成功');
        return true;
      }}>
      <ProForm.Group>
        <ProFormText
          width="md"
          name="company"
          label="企业名称"
          tooltip="与营业执照一致"
          placeholder="请输入完整企业名称"
          rules={[{ required: true, message: '该条目为必填项!' }]}
        />

        <ProFormText
          width="md"
          name="address"
          label="详细地址"
          placeholder="请输入企业详细地址"
          rules={[{ required: true, message: '该条目为必填项!' }]}
        />
      </ProForm.Group>

      <ProForm.Group>
        <ProFormText
          width="sm"
          name="legalrep"
          tooltip="与营业执照一致"
          label="法定代表人姓名"
          placeholder="请输入法定代表人姓名"
          rules={[{ required: true, message: '该条目为必填项!' }]}
        />
        <ProFormText
          width="md"
          name="legaltel"
          label="法定代表人手机号"
          placeholder="请输入法定代表人手机号"
          rules={[
            { required: true, message: '该条目为必填项!' },
            { pattern: /^\d{11}$/, message: '手机号必须是11位纯数字' },
          ]}
        />
      </ProForm.Group>

      <ProForm.Group>
        <ProFormText
          width="md"
          name="contactor"
          label="联系人姓名"
          placeholder="请输入联系人姓名"
        />
        <ProFormText
          width="md"
          name="contacttel"
          label="联系人电话"
          placeholder="请输入联系人电话"
          rules={[{ pattern: /^\d{11}$/, message: '手机号必须是11位纯数字' }]}
        />
      </ProForm.Group>

      <ProForm.Group>
        <ProFormSelect
          width="xs"
          name="guimo"
          label="企业规模"
          valueEnum={{
            teda: '特大',
            da: '大型',
            zhong: '中型',
            xiao: '小型',
            wei: '微型',
          }}
          placeholder="请选择企业规模"
          rules={[{ required: true, message: '该条目为必填项!' }]}
        />

        <ProFormDigit
          width="xs"
          label="注册资本"
          name="money"
          min={0}
          addonAfter="万元"
          fieldProps={{ precision: 0 }}
          rules={[{ required: true, message: '该条目为必填项!' }]}
        />

        <ProFormDigit
          width="xs"
          label="员工人数"
          name="population"
          min={1}
          addonAfter="人"
          fieldProps={{ precision: 0 }}
          rules={[{ required: true, message: '该条目为必填项!' }]}
        />
      </ProForm.Group>

      <ProForm.Group>
        <ProFormSelect
          width="sm"
          name="status"
          label="生产经营状况"
          valueEnum={{
            normal: '正常',
            abnormal: '异常',
          }}
          placeholder="请选择"
          rules={[{ required: true, message: '该条目为必填项!' }]}
        />

        <ProFormSelect
          width="sm"
          name="capital"
          label="企业标签"
          valueEnum={{
            scale: '规上企业',
            top50: '双50强企业',
          }}
          placeholder="请选择"
        />
      </ProForm.Group>

      <ProForm.Group>
        <ProFormCascader
          width="xl"
          name="industry"
          label="行业分类"
          fieldProps={{
            options: hangye2017,
            displayRender: displayRender
          }}
          rules={[{ required: true, message: '该条目为必填项!' }]}
          transform= {(value: string[]) => value[value.length - 1]}
        />
      </ProForm.Group>

      <ProFormTextArea width="xl" name="desc" label="备注" placeholder="请输入企业备注信息" />
    </ModalForm>
  );
}
